<template>
  <el-dialog v-model="open" :title="title" width="800px" append-to-body :close-on-click-modal="false">
    <el-descriptions :column="1" border>
      <el-descriptions-item label="模板名称">{{ form.templateName }}</el-descriptions-item>
      <el-descriptions-item label="模板类型">
        <span v-if="form.templateType=='0'">普通定价模板</span>
        <span v-if="form.templateType=='1'">会员定价模板</span>
        <span v-if="form.templateType=='2'">全部定价模板</span>
      </el-descriptions-item>
      <el-descriptions-item label="状态">
        <el-tag v-if="form.status==0" type="warning">禁用</el-tag>
        <el-tag v-else type="success">启用</el-tag>
      </el-descriptions-item>
      <el-descriptions-item>
        <el-table :data="tableData" :row-class-name="rowFilter">
          <el-table-column type="index" />
          <el-table-column label="时间段" prop="range" min-width="180" />
          <el-table-column label="普通价" prop="commonPrice" min-width="180" />
          <el-table-column label="会员价" prop="memberPrice" min-width="180" />
        </el-table>
      </el-descriptions-item>
    </el-descriptions>
  </el-dialog>
</template>

<script setup>
import { toRefs } from '@vueuse/shared'
import { watch } from 'vue'
import { getTimeUsed } from '../../../../../../../utils/ruoyi'
import { reactive } from '@vue/runtime-core'
import useVenStore from '../../../../../../../store/modules/ven'


const venStore = useVenStore()
const props = defineProps({
  props: {
    type: Object,
    default: () => ({
      open: false,
      title: ''
    })
  }
})
const data = reactive({
  form: { },
  tableData: []
})
const { open, title } = toRefs(props.props)
const { form, tableData } = toRefs(data)


watch(open, (val) => {
  if (val) {
    tableData.value = getTimeUsed(venStore.businessPeriod[0], venStore.businessPeriod[1])
    form.value = props.props.data

    const priceArray = JSON.parse(form.value.priceArray)
    _.each(tableData.value, (t, i) => {
      try {
        if (t.used) {
          t.commonPrice = priceArray[0][i]
          t.memberPrice = priceArray[1][i]
        } else {
          t.commonPrice = '-1'
          t.memberPrice = '-1'
        }
      } catch (e) {}
    })
  }
})

function rowFilter({ row }) {
  return row.used ? '' : 'hideRow'
}

</script>

<style lang="scss" scoped>
:deep(.hideRow){display: none;}
</style>
